<!DOCTYPE html>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> 
 <%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
  <%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %> 
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<title>余额</title>
	<link rel="stylesheet" href="${pageContext.request.contextPath}/css/weui.css"/>
	<link rel="stylesheet" href="${pageContext.request.contextPath}/css/wechat.css"/>
	<link rel="stylesheet" href="${pageContext.request.contextPath}/css/iScroll.css"/>
</head>
<body >
	<input type="hidden" id="rowCount" value="${pageView.rowCount }">
	<div id="wrapper">
		<div id="scroller">
			<div id="pullDown">
				<span class="pullDownIcon"></span><span class="pullDownLabel">下拉刷新...</span>
			</div>
			<div class="weui_cells_title text-blue">${hqName }</div>
			<ul id="thelist"></ul>
			<div id="pullUp">
				<span class="pullUpIcon"></span><span class="pullUpLabel">上拉加载下页...</span>
			</div>
			<input type="hidden" id="hqId" value="${hqId }">
			<input type="hidden" id="memberId" value="${memberId }">
		</div>
	</div>
	<div class="footer">
		<span>本服务由</span>
	    <img src="${pageContext.request.contextPath}/images/logo.png" title="油掌柜" />
	    <span>提供技术支持</span>
	</div>
	
	<script type="text/javascript" src="${pageContext.request.contextPath}/js/iscroll.js"></script>
	 <script type="text/javascript" src="${pageContext.request.contextPath}/js/iscroll_show.js"></script>
	 <script src="${pageContext.request.contextPath}/js/zepto.min.js"></script>
	<script type="text/javascript">
		var myScroll,
		pullDownEl, pullDownOffset,
		pullUpEl, pullUpOffset,
		
		pageSize=10,rowCount,
		generatedCount = 0,
		hqId,memberId;
		$(function(){
			hqId = $("#hqId").val();
			memberId = $("#memberId").val();
			pullDownAction();
		});
		
		function pullDownAction () {
  			$.ajax({
		  	      type: "POST",
		  	      url: "${pageContext.request.contextPath}/member/details",
		  	      data: {pageNo:1,pageSize:pageSize,hqId:hqId,memberId:memberId},
		  	      success: function(data){
		  	    	var result = '';
		  	    	  if(data.code == 200){
		  	    		generatedCount = 1;
	  	    			rowCount = data.rowCount;
	  	    			if(data.records.length<=0){
	  	    				$("#pullDown").hide();
	  	    				$("#pullUp").hide();
			  	    		$("#thelist").html("<li id=\"no_date_li\" style=\"text-align: center;\">"+
			              	 "<div class=\"weui_cell\" id=\"fuelling_div\" style=\"text-align: center;\">当前无数据</div></li>");
	  	    			}else{
			  	    		$("#thelist").html("");
	  	    			}
		  	    		$.each(data.records, function(name, value) {
		  	    			result = "<li><div class=\"weui_cell\">"+
			                            "<div class=\"weui_cell_bd weui_cell_primary\">"+
			                            "<p>"+this.amountTypeName+"<span class=\"navi-address\">余额"+this.balanceAmount+"</span></p>"+
			                        "</div>"+
			                        "<div class=\"weui_cell_ft\">"+
			                            "<p>"+this.createdTime+"<span class=\"balance-pay text-green\">"+this.amount+"</span></p>"+
			                        "</div>"+
			                    "</div></li>";
			  	    		$("#thelist").append(result);
			  	    		myScroll.refresh();
		  	    		});
		  	    	  }else{
			  	        alert("加油站列表加载失败！");
		  	    	  }
		  	      }
		  	   });
		};
		
		function pullUpAction () {
			$.ajax({
		  	      type: "POST",
		  	      url: "${pageContext.request.contextPath}/member/details",
		  	      data: {pageNo:(++generatedCount),pageSize:pageSize,hqId:hqId,memberId:memberId},
		  	      
		  	      success: function(data){
		  	    	var result = '';
		  	    	  if(data.code == 200){
	  	    			rowCount = data.rowCount;
	  	    			$.each(data.records, function(name, value) {
		  	    			result = "<li><div class=\"weui_cell\">"+
			                            "<div class=\"weui_cell_bd weui_cell_primary\">"+
			                            "<p>"+this.amountTypeName+"<span class=\"navi-address\">余额"+this.balanceAmount+"</span></p>"+
			                        "</div>"+
			                        "<div class=\"weui_cell_ft\">"+
			                            "<p>"+this.createdTime+"<span class=\"balance-pay text-green\">"+this.amount+"</span></p>"+
			                        "</div>"+
			                    "</div></li>";
			  	    		$("#thelist").append(result);
			  	    		myScroll.refresh();
		  	    		});
		  	    	  }else{
			  	        alert("加油站列表加载失败！");
		  	    	  }
		  	      }
		  	   });
		};
		
	</script>
</body>
</html>